<template>
  <div class="list-table">
    <div class="area-header">
      <span class="area-header-title">{{ $t('持股信息') }}</span>
    </div>
    <div style="text-align: right;margin-bottom: 10px;">
      <el-form ref="form" :model="form" :rules="rules" label-width="120px" class="dataForm">
        <el-row>
          <el-col :span="12">
            <el-form-item :label="$t('我方持有总股数(万股)')" prop="shareHold">
              <Money v-model="form.shareHold" :placeholder="$t('我方持有总股数(万股)')" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item :label="$t('持股比例(%)')" prop="shareRate">
              <Ratio v-model="form.shareRate" :placeholder="$t('持股比例(%)')" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>

    <div class="area-header">
      <span class="area-header-title">{{ $t('A股测算结果') }}</span>
    </div>
    <div v-loading="loading" style="width: 100%;overflow: auto;">
      <table class="bfEvaluation" border="1" style="border-collapse:collapse;">
        <tr>
          <th style="width: 120px;">{{ $t('是否创投基金') }}</th>
          <th style="width: 120px;">{{ $t('日期') }}</th>
          <th style="width: 200px;">{{ $t('集中竞价') }}</th>
          <th style="width: 200px;">{{ $t('大宗交易') }}</th>
          <th style="width: 200px;">{{ $t('协议转让') }}</th>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center" rowspan="4"><p>{{ $t('创投基金') }}</p></td>
          <td style="text-align: center"><p>{{ $t('现在可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_0_Y" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_0_Y" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_0_Y" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center"><p>{{ $t('30天后可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_30_Y" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_30_Y" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_30_Y" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center"><p>{{ $t('60天后可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_60_Y" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_60_Y" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_60_Y" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center"><p>{{ $t('90天后可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_90_Y" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_90_Y" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_90_Y" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center" rowspan="4"><p>{{ $t('非创投基金') }}</p></td>
          <td style="text-align: center"><p>{{ $t('现在可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_0_N" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_0_N" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_0_N" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center"><p>{{ $t('30天后可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_30_N" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_30_N" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_30_N" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center"><p>{{ $t('60天后可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_60_N" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_60_N" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_60_N" /></td>
        </tr>
        <tr style="height: 50px;">
          <td style="text-align: center"><p>{{ $t('90天后可交易') }}</p></td>
          <td style="text-align: center"><p v-html="form.JZJJ_90_N" /></td>
          <td style="text-align: center"><p v-html="form.DZJY_90_N" /></td>
          <td style="text-align: center"><p v-html="form.XYZR_90_N" /></td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script>

import { getListedDeal } from '@/api/deal/listed/base/listedDeal'
import { checkA } from '@/api/deal/listed/reducing/listedReducingNotice'

export default {
  data() {
    return {
      // 遮罩层
      loading: true,
      // 查询参数
      queryParams: {
        listedId: '',
        tradingWay: '',
        ventureFund: '',
        noticeDateStr: '',
        rateNotExceeding: '',
        checkDay: ''
      },
      // 表单参数
      form: {
        shareHold: '',
        shareRate: '',
        // 创投基金-现在-集中竞价
        JZJJ_0_Y: '',
        // 创投基金-现在-大宗交易
        DZJY_0_Y: '',
        // 创投基金-现在-协议转让
        XYZR_0_Y: '',
        // 创投基金-近30天-集中竞价
        JZJJ_30_Y: '',
        // 创投基金-近30天-大宗交易
        DZJY_30_Y: '',
        // 创投基金-近30天-协议转让
        XYZR_30_Y: '',
        // 创投基金-近60天-集中竞价
        JZJJ_60_Y: '',
        // 创投基金-近60天-大宗交易
        DZJY_60_Y: '',
        // 创投基金-近60天-协议转让
        XYZR_60_Y: '',
        // 创投基金-近90天-集中竞价
        JZJJ_90_Y: '',
        // 创投基金-近90天-大宗交易
        DZJY_90_Y: '',
        // 创投基金-近90天-协议转让
        XYZR_90_Y: '',
        // 非创投基金-近30天-集中竞价
        JZJJ_30_N: '',
        // 非创投基金-近30天-大宗交易
        DZJY_30_N: '',
        // 非创投基金-近30天-协议转让
        XYZR_30_N: '',
        // 非创投基金-现在-集中竞价
        JZJJ_0_N: '',
        // 非创投基金-现在-大宗交易
        DZJY_0_N: '',
        // 非创投基金-现在-协议转让
        XYZR_0_N: '',
        // 非创投基金-近60天-集中竞价
        JZJJ_60_N: '',
        // 非创投基金-近60天-大宗交易
        DZJY_60_N: '',
        // 非创投基金-近60天-协议转让
        XYZR_60_N: '',
        // 非创投基金-近90天-集中竞价
        JZJJ_90_N: '',
        // 非创投基金-近90天-大宗交易
        DZJY_90_N: '',
        // 非创投基金-近90天-协议转让
        XYZR_90_N: ''
      },
      // 上市项目ID
      listedId: '',
      // 表单校验
      rules: {}
    }
  },
  created() {
    // this.getCheckA()
  },
  methods: {
    /** 获取当前项目持股信息 */
    init() {
      this.loading = true
      // 获取关联数据
      getListedDeal(this.listedId).then(res => {
        this.form.shareHold = res.data.shareHold
        this.form.shareRate = res.data.shareRate
        this.loading = false
      })
    },
    // 获取验证信息
    getCheckA() {
      checkA(this.queryParams).then(res => {
        if (res.data != null) {
          this.$set(this.form, 'JZJJ_0_Y', this.getText(res.data.JZJJ_0_Y))
          this.$set(this.form, 'DZJY_0_Y', this.getText(res.data.DZJY_0_Y))
          this.$set(this.form, 'XYZR_0_Y', this.getText(res.data.XYZR_0_Y))
          this.$set(this.form, 'JZJJ_30_Y', this.getText(res.data.JZJJ_30_Y))
          this.$set(this.form, 'DZJY_30_Y', this.getText(res.data.DZJY_30_Y))
          this.$set(this.form, 'XYZR_30_Y', this.getText(res.data.XYZR_30_Y))
          this.$set(this.form, 'JZJJ_60_Y', this.getText(res.data.JZJJ_60_Y))
          this.$set(this.form, 'DZJY_60_Y', this.getText(res.data.DZJY_60_Y))
          this.$set(this.form, 'XYZR_60_Y', this.getText(res.data.XYZR_60_Y))
          this.$set(this.form, 'JZJJ_90_Y', this.getText(res.data.JZJJ_90_Y))
          this.$set(this.form, 'DZJY_90_Y', this.getText(res.data.DZJY_90_Y))
          this.$set(this.form, 'XYZR_90_Y', this.getText(res.data.XYZR_60_Y))
          this.$set(this.form, 'JZJJ_0_N', this.getText(res.data.JZJJ_0_N))
          this.$set(this.form, 'DZJY_0_N', this.getText(res.data.DZJY_0_N))
          this.$set(this.form, 'XYZR_0_N', this.getText(res.data.XYZR_0_N))
          this.$set(this.form, 'JZJJ_30_N', this.getText(res.data.JZJJ_30_N))
          this.$set(this.form, 'DZJY_30_N', this.getText(res.data.DZJY_30_N))
          this.$set(this.form, 'XYZR_30_N', this.getText(res.data.XYZR_30_N))
          this.$set(this.form, 'JZJJ_60_N', this.getText(res.data.JZJJ_60_N))
          this.$set(this.form, 'DZJY_60_N', this.getText(res.data.DZJY_60_N))
          this.$set(this.form, 'XYZR_60_N', this.getText(res.data.XYZR_60_N))
          this.$set(this.form, 'JZJJ_90_N', this.getText(res.data.JZJJ_90_N))
          this.$set(this.form, 'DZJY_90_N', this.getText(res.data.DZJY_90_N))
          this.$set(this.form, 'XYZR_90_N', this.getText(res.data.XYZR_60_N))
        }
      })
    },
    // 获取拼接字符串
    getText(data) {
      let text = '<p>最多可交易' + data.tradingShare + '万股，' + data.tradingRate + '%；</p>'
      if (data.reason !== '' && data.reason !== null) {
         text += '<p>原因：' + data.reason + '</p>'
      }
      return text
    }
  }
}
</script>
